<template>
	<sjj-input
		v-model="liveValue"
		:name="name"
		:placeholder="placeholder"
		:disabled="disabled"
		:readonly="readonly"
		@focus="handleFocus"
		@blur="handleBlur"
		@change="handleChange"
		v-bind="$attrs"
		@keydown.native="handleKeydown"
	></sjj-input>
</template>

<script>
import SjjInput from 'element-ui/packages/input';
import { formatter, unFormatter, numberKeyCodes, decimalKeyCodes, plusKeyCodes, minusKeyCodes, operKeyCodes } from './currentcy.js';
export default {
	name: 'swMoneyInput',
	components: { SjjInput },
	props: {
		name: 'String',
		value: { type: [String, Number], default: '' },
		format: { type: String, default: '16|2' },
		placeholder: String,
		separator: { type: String, default: ',' },
		decimalSymbol: { type: String, default: '.' },
		disabled: { type: Boolean, default: false },
		readonly: { type: Boolean, default: false },
		rounding: { type: Boolean, default: false },
		appendKeyCodes: Array,
		preFormatter: Function
	},
	data() {
		return {
			hiddenValue: '', // 合法金额值
			liveValue: '' // 展示值
		};
	},
	created() {
		let userFormatVal = this.value + '';
		if (this.preFormatter) {
			userFormatVal = this.preFormatter(userFormatVal);
		}
		this.liveValue = formatter(userFormatVal + '', this.separator, this.decimalSymbol, this.format, this.integerFormat, this.rounding);
		this.hiddenValue = unFormatter(this.liveValue, this.separator);
	},
	watch: {
		value(val, oldVal) {
			let userFormatVal = this.value + '';
			if (this.preFormatter) {
				userFormatVal = this.preFormatter(userFormatVal);
			}
			this.liveValue = formatter(userFormatVal + '', this.separator, this.decimalSymbol, this.format, this.integerFormat);
			this.hiddenValue = unFormatter(this.liveValue, this.separator);
		}
	},
	methods: {
		focus() {
			let inputInner = this.$el.querySelector('.el-input__inner');
			inputInner.focus();
		},
		blur() {
			let inputInner = this.$el.querySelector('.el-input__inner');
			inputInner.blur();
		},
		select() {
			let inputInner = this.$el.querySelector('.el-input__inner');
			inputInner.select();
		},
		handleFocus(event) {
			this.liveValue = this.hiddenValue;
			this.$emit('focus', event);
		},
		handleBlur(event) {
			let userFormatVal = this.liveValue;
			if (this.preFormatter) {
				userFormatVal = this.preFormatter(userFormatVal);
			}
			this.liveValue = formatter(userFormatVal + '', this.separator, this.decimalSymbol, this.format, this.integerFormat, this.rounding);
			this.hiddenValue = unFormatter(this.liveValue, this.separator);
			this.$emit('input', this.hiddenValue);
			this.$nextTick(() => {
				this.$emit('blur', event);
			});
		},
		handleChange(val) {
			if (/[\u4e00-\u9fa5]/g.test(val)) {
				// 非IE,忽略可输入的中文
				val = this.hiddenValue;
			}
			let userFormatVal = val;
			if (this.preFormatter) {
				userFormatVal = this.preFormatter(val);
			}
			this.liveValue = formatter(userFormatVal + '', this.separator, this.decimalSymbol, this.format, this.integerFormat, this.rounding);
			this.hiddenValue = unFormatter(this.liveValue, this.separator);
			this.$emit('input', this.hiddenValue);
			this.$nextTick(() => {
				this.$emit('change', this.hiddenValue);
			});
		},
		handleKeydown(event) {
			if (this.readonly || this.disabled) {
				return;
			}
			let keyCode = event.keyCode;
			if (event.shiftKey) {
				keyCode = -9 + '' + keyCode;
			}
			if (event.ctrlKey) {
				keyCode = -7 + '' + keyCode;
			}
			// 获取光标位置
			let cursurPosition = 0;
			let inputInner = this.$el.querySelector('.el-input__inner');
			if (!inputInner) {
				cursurPosition = -1;
			} else if (inputInner.selectionStart !== null && inputInner.selectionStart !== undefined) {
				cursurPosition = inputInner.selectionStart;
			} else {
				let range = document.selection.createRange();
				range.moveStart('character', -inputInner.val().length);
				cursurPosition = range.text.length;
			}
			keyCode = parseInt(keyCode);
			let allowKeyCodes = [...numberKeyCodes, ...decimalKeyCodes, ...operKeyCodes, ...plusKeyCodes, ...minusKeyCodes];
			if (this.appendKeyCodes && this.appendKeyCodes.length) {
				allowKeyCodes = allowKeyCodes.concat(this.appendKeyCodes);
			}
			// let signalKeyCodes = plusKeyCodes.concat(minusKeyCodes)
			if (
				allowKeyCodes.indexOf(keyCode) < 0 ||
				(this.liveValue.indexOf('.') >= 0 && decimalKeyCodes.indexOf(keyCode) >= 0) ||
				((this.liveValue.indexOf('+') >= 0 || this.liveValue.indexOf('-') >= 0) && minusKeyCodes.indexOf(keyCode) >= 0) ||
				((this.liveValue.indexOf('+') >= 0 || this.liveValue.indexOf('-') >= 0) && plusKeyCodes.indexOf(keyCode) >= 0) ||
				(cursurPosition > 0 && plusKeyCodes.concat(minusKeyCodes).indexOf(keyCode) >= 0)
			) {
				event.preventDefault();
			} else {
				if (cursurPosition === 0 && (plusKeyCodes.indexOf(keyCode) >= 0 || minusKeyCodes.indexOf(keyCode) >= 0)) {
					if ((this.liveValue.indexOf('-') < 0 && minusKeyCodes.indexOf(keyCode) >= 0) || (this.liveValue.indexOf('+') < 0 && plusKeyCodes.indexOf(keyCode) >= 0)) {
						// 123
					} else {
						event.preventDefault();
					}
				}
			}
		}
	}
};
</script>
